<template>
  <div class="h-100P">
    <el-switch
      :value="value"
      inactive-value="DISABLE"
      active-value="ENABLE"
      active-color="#67C23A"
      @change="handleChange"
    />
    <span class="mg-left-10">{{ enableStateEnum[value] }}</span>
  </div>
</template>

<script>
  export default {
    name: 'SwitchDeviceState',
    model: {
      prop: 'value',
      event: 'change'
    },
    props: {
      value: { type: String, default: 'DISABLE' }
    },
    computed: {
      enableStateEnum() {
        return {
          ENABLE: '启用',
          DISABLE: '禁用'
        }
      }
    },
    methods: {
      handleChange(value) {
        this.$emit('change', value)
      }
    }

  }
</script>

<style scoped></style>
